<template>
    <div>
      <el-form
        :model="listQuery"
        :rules="rules"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="品牌名称" prop="name">
          <el-input v-model="listQuery.name"></el-input>
        </el-form-item>
        <el-form-item label="品牌首字母" prop="name">
          <el-input v-model="listQuery.first_letter"></el-input>
        </el-form-item>
        <el-form-item label="排序" prop="name">
          <el-input v-model="listQuery.sort"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
          <el-button @click="resetForm('ruleForm')">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
  </template>
  
  <script>
  import { addProductBrand } from "@/api/product";
  export default {
    name: "addAttr",
    data: function () {
      return {
        listQuery:{
            name:''
        },
        rules: {
            name: [
              { required: true, message: '请输入活动名称', trigger: 'blur' },
              { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
            ],
          }
      }
    },
    methods: {
         submitForm(formName) {
          this.$refs[formName].validate((valid) => {
            if (valid) {
             addProductBrand(this.listQuery).then(res=>{
              console.log(res)
              if(res.status == 200){
                this.$message({
                  message:'恭喜你，添加了一条商品信息',
                  type:'success',
                })
                this.$router.push('/pms/brand')
              }
            })
            } else {
              console.log('error submit!!');
              return false;
            }
          });
        },
        resetForm(formName) {
          this.$refs[formName].resetFields();
        }
    },
    mounted() {},
  };
  </script>
  
  <style>
  </style>
  